<template>
  <div>
    <div>
      <div style="display: inline-block">
        <el-button icon="el-icon-back" size="small" style="font-family: Microsoft YaHei" type="text"
                   @click="goBack">返回
        </el-button>
      </div>
      <div style="display: inline-block">|</div>
      <div style="display: inline-block;">
        <div style="padding-bottom: 15px;margin-left:10px">
          <span style="font-family: Microsoft YaHei;display: inline-block; font-size: 14px;">详情</span>
        </div>
      </div>
    </div>
    <div style="min-width: 100%">
      <div style="display: inline-block">大纲：</div>
      <div style="display: inline-block">
        <el-cascader
          :disabled="true"
          :options="options"
          :props="{value: 'id', label: 'name', multiple: false, checkStrictly: true, emitPath: false}"
          :value="this.outlineDetailId"
          clearable
          filterable
          placeholder="请选择"
          size="small"
          style="min-width: 750px;margin-top: 10px;margin-bottom: 10px"></el-cascader>
      </div>
    </div>
    <el-tabs v-model="activeName" type="card">
      <el-tab-pane label="知识点" name="first">
        <ShowKnowledgeTable :examBookId="this.examBookId" :examOutlineId="this.examOutlineId"
                            :outlineDetailId="this.outlineDetailId" :pageType="this.pageType"></ShowKnowledgeTable>
      </el-tab-pane>
      <el-tab-pane label="试题" name="second">
        <ExerciseGroupLibTable></ExerciseGroupLibTable>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import ShowKnowledgeTable from "../examGuideBook/ShowKnowledgeTable"
import ExerciseGroupLibTable from "../exerciseLib/ExerciseGroupLibTable"

export default {
  name: "KnowledgeAndExercise",
  components: {
    ShowKnowledgeTable,
    ExerciseGroupLibTable,
  }, data() {
    return {
      activeName: "",
      outlineDetailId: "",
      examBookId: "",
      examOutlineId: "",
      pageType: "",
      options: []
    }
  },
  methods: {
    goBack() {
      this.$router.go("-1")
    }
  },
  created() {
    this.axios.get('/pmph/action/examBook/selectOutlineTree', {
      params: {
        examOutlineId: this.$route.query.examOutlineId
      }
    }).then((response) => {
      this.options = response.data
    })
    if (this.$route.query.pageType === 'detailList') {
      this.activeName = "first"
    } else {
      this.activeName = "second"
    }
    // 要点ID
    this.outlineDetailId = this.$route.query.outlineDetailId
  },
  beforeRouteLeave(to, from, next) {
    if (to.name == 'detail') {
      to.meta.isUseCache = true
    }
    next();
  }
}
</script>

<style scoped>

</style>
